<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<link rel="stylesheet" href="/static/jquery.json-viewer.css"></link>
<script src="https://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="/static/jquery.json-viewer.js"></script>
<style>
    table {
        border-collapse: collapse;
        border: none;
        line-height:2em;
    }
</style>
<body>
<h2>EasyTask-L!节点:${node}</h2>
<table width="100%">
    <tr style="height: 7em">
        <td style="width:60%">
            <table width="100%">
                <tr>
                    <td width="20%"></td>
                    <td width="40%">任务名:<input type="text" id="name" style="width:60px"></td>
                    <td></td>
                </tr>
                <tr>
                    <td><input type="button" value="添加一次性任务" onclick="addOnceTask()"></td>
                    <td><input type="text" id="time" style="width:30px">秒后执行</td>
                    <td>任务ID:<span id="oncetaskId"></span></td>
                </tr>
                <tr>
                    <td><input type="button" value="添加周期任务" onclick="addPeriodTask()"></td>
                    <td>每隔<input type="text" id="period" style="width:30px">秒执行一次。
                        是否立即执行
                        <select id="immediately">
                            <option value="0" selected>否</option>
                            <option value="1">是</option>
                        </select></td>
                    <td>任务ID:<span id="periodtaskId"></span></td>
                </tr>
            </table>
        </td>
        <td rowspan="5" style="vertical-align:top">
            <input type="button" value="清除信息" onclick="clearInfo()">
            <br>
            <div id="taskInfo" style="width: 100%;height: 900px;overflow: scroll">
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                环形队列任务数：<span id="spWaiteExcuteQty"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                分派任务线程池：
                等待任务数：<span id="dis_taskQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                执行中的线程数：<span id="dis_activeQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                核心线程数：<span id="dis_coreSize"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                执行任务线程池：
                等待任务数：<span id="work_taskQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                执行中的线程数：<span id="work_activeQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                核心线程数：<span id="work_coreSize"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td style="vertical-align:top">
            TaskId:<input type="text" id="search"><input type="button" id="btnsearch" value="搜索" onclick="searchTaskId()">
            <div id="dbInfo" style="width: 68em;height: 800px;overflow: scroll">
                <pre id="json-renderer"></pre>
            </div>
        </td>
    </tr>
</table>

</body>
</html>
<script>
    $(function () {
        setInterval("showRaskInfo()", 1000);
        setInterval("showPoolsInfo()", 1000);
    });

    function showRaskInfo() {
        $.get("/s/taskInfo", function (data) {
            $("#taskInfo").html(data);
        })
    }
    function showPoolsInfo() {
        $.get("/s/getPoolsInfo", function (data) {
            $("#spWaiteExcuteQty").text(data.waiteExcuteQty);
            $("#dis_taskQty").text(data.dispatch.taskQty);
            $("#dis_activeQty").text(data.dispatch.activeQty);
            $("#dis_coreSize").text(data.dispatch.coreSize);
            $("#work_taskQty").text(data.worker.taskQty);
            $("#work_activeQty").text(data.worker.activeQty);
            $("#work_coreSize").text(data.worker.coreSize);
        })
    }

    function clearInfo() {
        $.get("/s/clearTaskInfo", function (data) {
        })
    }

    function addOnceTask() {
        var data = {
            name: $('#name').val(),
            time: $('#time').val()
        }
        if (data.name == "") {
            alert("任务名不能为空!")
            return;
        }
        if (data.time == "") {
            alert("执行时间不能为空!")
            return;
        }
        $.post("/s/once", data, function (data) {
            $("#oncetaskId").text(data);
        })
    }

    function addPeriodTask() {
        var data = {
            name: $('#name').val(),
            period: $('#period').val(),
            immediately: $('#immediately').val()

        }
        if (data.name == "") {
            alert("任务名不能为空!")
            return;
        }
        if (data.period == "") {
            alert("执行周期不能为空!")
            return;
        }
        $.post("/s/period", data, function (data) {
            $("#periodtaskId").text(data);
        })
    }
    function searchTaskId() {
        if ($("#search").val() == "") {
            alert("任务ID不能为空!")
            return;
        }
        $.get("/s/searchDbInfo?taskId="+$("#search").val(), function (data) {
            $('#json-renderer').jsonViewer(data);
        })
    }
</script>
